<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1,shrink-to-fit=no" />

		<title></title>

		<link rel="stylesheet" type="text/css" href="bootstrap-4.5.0/dist/css/bootstrap.css" />

		<link rel="stylesheet" type="text/css" href="font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.css" />

		<link rel="stylesheet" type="text/css" href="css/video_details.css" />

		<script src="js/jquery-3.5.1.slim.min.js" type="text/javascript" charset="utf-8"></script>

		<script src="bootstrap-4.5.0/dist/js/bootstrap.bundle.min.js" type="text/javascript" charset="utf-8"></script>

		<script src="js/popper.js" type="text/javascript" charset="utf-8"></script>

		<script src="bootstrap-4.5.0/dist/js/bootstrap.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!-- 头部 -->
		<div style="width: 100%;">
				<div class="container-fluid">
					<div class="row" style="">
						<div class="col-lg-3 col-12 ">
							<div style="line-height: 100px;" class="text-lg-right text-center">
								<img src="img/logo-header-06.png" />
							</div>
						</div>
		
						<div class="col-lg-5 col-12 pb-2  mt-lg-4 pt-lg-2" style="">
							<div class="rounded-pill border w-100" style="">
								<div class="row ">
									<div class="col-3 d-lg-block d-none pr-0 ">
										<div class="text-center" style="border-right:1px solid gainsboro ;">
											<a href="#" class=" dropdown-toggle nav-link text-white z-aa p-0" data-toggle='dropdown'>MOVIES</a>
											<div class="dropdown-menu " style="">
												<a href="#" class="dropdown-item " style="color:#e40914 !important;
		border-bottom: 1px solid dimgrey;width: 75%;margin: 0 auto;padding-bottom: 10px;">Movies</a>
												<a href="#" class="dropdown-item xia-aa my-2">Videos</a>
												<a href="#" class="dropdown-item xia-aa my-2">Categories</a>
												<a href="#" class="dropdown-item xia-aa my-2">Popular</a>
											</div>
										</div>
									</div>
									<div class="col-lg-9 col-12 pl-sm-0">
										<form class="form-control rounded-pill border-0" style="height: 40px;">
											<input type="text" placeholder="Search for a Movie..." class="border-0" style="outline: none; " />
											<button class="btn fa fa-search rounded " style="float: right;color: #5a646d;"></button>
										</form>
									</div>
								</div>
							</div>
		
						</div>
		
						<div class="col-4 d-lg-block d-none ">
							<div class="d-flex flex-wrap align-items-center" style="height: 100px;">
								<a href="#" class="a1 border-0">
									<div class="rounded-circle mx-1 rc " style="width:40px;height: 40px; position: relative;">
										<i class="fa fa-facebook fa-1x aa1 mx-auto" style="position: absolute;left: 14px;top: 12px;"></i>
									</div>
								</a>
								<a href="#" class="a1 border-0">
									<div class="rounded-circle mx-1 rc " style="width:40px;height: 40px; position: relative;">
										<i class="fa fa-twitter fa-1x aa1 mx-auto" style="position: absolute;left: 11px;top: 12px;"></i>
									</div>
								</a>
								<a href="#" class="a1 border-0">
									<div class="rounded-circle mx-1 rc " style="width:40px;height: 40px; position: relative;">
										<i class="fa fa-pinterest-p fa-1x aa1 mx-auto" style="position: absolute;left: 13px;top: 12px;"></i>
									</div>
								</a>
								<a href="#" class="a1 border-0">
									<div class="rounded-circle mx-1 rc" style="width:40px;height: 40px; position: relative;">
										<i class="fa fa-linkedin fa-1x aa1 mx-auto" style="position: absolute;left: 12px;top: 10px;"></i>
									</div>
								</a>
								<a href="#"><button type="button" class="btn px-4 ml-2 tbtn rounded-pill">READ MORE</button></a>
							</div>
						</div>
					</div>
				</div>
			</div>
		<!-- 导航栏 -->
		<div class="container-fluid p-0" style="background-color: #111111;">
			<div class="container">
				<div class="navbar navbar-expand-lg navbar-dark p-0 ">
					<button class="navbar-toggler my-2 mx-2" data-toggle="collapse" data-target="#num">
						<i class="fa fa-bars" style="color: white;"></i>
					</button>
		
					<div class="collapse navbar-collapse" id="num">
						<ul class="navbar-nav">
							<li class="nav-item  mx-1 d-md-block d-none">
								<button class="btn my-2 mx-2 mr-auto">
									<i class="fa fa-bars" style="color: white;"></i>
								</button>
							</li>
							<li class="nav-item  mx-1">
								<a href="index.html" class="nav-link z-a text-white default px-3" style="line-height: 40px;font-weight: 600;">HOME</a>
							</li>
		
							<li class="nav-item mx-1 dropdown ">
								<a href="#" class="nav-link text-white px-3 z-a" style="line-height: 40px;font-weight: 600;" data-toggle='dropdown'>MOVIE</a>
								<div class="dropdown-menu" style="background-color: #1e1e1e;">
									<a href="shop.html" class="dropdown-item xia-a">Shop</a>
									<a href="shop_details.html" class="dropdown-item xia-a">Shop_details</a>
								</div>
							</li>
		
							<li class="nav-item mx-1 dropdown ">
								<a href="#" class="nav-link text-white px-3 z-a" style="line-height: 40px;font-weight: 600;" data-toggle='dropdown'>VIDEO</a>
								<div class="dropdown-menu" style="background-color: #1e1e1e;">
									<a href="video.html" class="dropdown-item xia-a">Video</a>
									<a href="video_details.html" class="dropdown-item xia-a">Video_details</a>
								</div>
							</li>
		
							<li class="nav-item mx-1 dropdown ">
								<a href="#" class="nav-link text-white px-3 z-a" style="line-height: 40px;font-weight: 600;" data-toggle='dropdown'>FEATURES</a>
								<div class="dropdown-menu" style="background-color: #1e1e1e;">
									<a href="about.html" class="dropdown-item xia-a">About </a>
									<a href="submit.html" class="dropdown-item xia-a">Submit</a>
									<a href="list_authors.html" class="dropdown-item xia-a">List_authors</a>
									<a href="authors_details.html" class="dropdown-item xia-a">Authors_details</a>
								</div>
							</li>
		
							<li class="nav-item mx-1 dropdown ">
								<a href="#" class="nav-link text-white px-3 z-a" style="line-height: 40px;font-weight: 600;" data-toggle='dropdown'>BLOG</a>
								<div class="dropdown-menu" style="background-color: #1e1e1e;">
									<a href="blog.html" class="dropdown-item xia-a">Blog </a>
									<a href="blog_detail.html" class="dropdown-item xia-a">Blog_detail</a>
								</div>
							</li>
		
							<li class="nav-item mx-1 ">
								<a href="contact.html" class="nav-link text-white px-3 z-a" style="line-height: 40px;font-weight: 600;">CONTENT</a>
							</li>
						</ul>
					</div>
					<div class="">
						<p class="text-white mt-3" style="display: inline;">
							<span class="fa fa-user mr-2"></span>
							WELCOME GUEST! <span style="color: #b30e12;">LOGIN</span></p>
					</div>
				</div>
			</div>
		</div>
		<!-- 导航栏下 -->
		<div style="background-image: url(img/bg-page-title-04.jpg); width: 100%;">
			<div style="background-color: rgba(8,8,8,0.5); height: 511px;">
				<p style="color: white;text-align: center;font-size: 30px; padding-top: 80px;" class="m-0">Modern warfare(2018)</p>
				<p style="color: white;text-align: center;color: #c5cac8;" class="mt-3">To start the day in the best way,enjoy the
					extraordingry <br /> buffetbreakfast in the our courtryard caressed</p>
			</div>
		</div>

		<!-- 中部网格 -->
		<div class="container mt-sm-5 pt-sm-5" >
			<div class="row mt-sm-5 pt-sm-5">
				<!-- 左边 -->
				<div class="col-lg-3 col-9 mt-sm-5">
					<div class="left-div position-sticky sticky-top">
						<div>
					<div style="overflow: hidden;"class="mt-2 mx-2" ><a href="#">
					<img src="img/product-05.jpg" class="w-100 img1 " style="position: relative;" /></a></div>
						<!-- 文字定位 -->
					<div style=""class="t-p">
						<p style="color: white;">Rating:<i class="fa fa-star text-warning"></i>8/10
							<span class="ml-4">240 Views</span>
						</p>
					</div>
					<!-- 图标定位 -->
					<div style=""class="t-img">
						<img src="img/star-01.png" style="margin-left: 5px;" />
						<p style="color: white;position: absolute;left: 19px;bottom: 43px;">5</p>
						<p style="color: white;font-size: 14px; text-align: center;" class="m-0 pb-2"><b>IMDb</b> </p>
						<a href="#" style="text-decoration: none; display: block; width: 50px;height: 25px;color: white;background-color: red;text-align: center;">HD</a>
					</div>
				
					</div>
					<!-- 文字网格 -->
					<div class="row mt-3">
						<div class="col-6 pl-4">
							<p style=" font-weight: 600;" class="m-0 ">Actors:</p>
						</div>
						<div class="col-6 ">
							<p style="color:#747474" class="m-0  text-left">Julia Toufis</p>
						</div>
						<div class="col-6 my-1  pl-4">
							<p style=" font-weight: 600;" class="m-0 ">Writer:</p>
						</div>
						<div class="col-6 my-1 ">
							<p style="color:#747474" class="m-0  text-left">Noah</p>
						</div>
						<div class="col-6 my-1  pl-4 pr-0">
							<p style=" font-weight: 600;" class="m-0">Release Date:</p>
						</div>
						<div class="col-6 my-1 ">
							<p style="color:#747474" class="m-0 text-left">May 12,2018</p>
						</div>
						<div class="col-6 my-1  pl-4">
							<p style=" font-weight: 600;" class="m-0">Genres:</p>
						</div>
						<div class="col-6 my-1 ">
							<p style="color:#747474" class="m-0  text-left">Action</p>
						</div>
						<div class="col-6 my-1  pl-4">
							<p style=" font-weight: 600;" class="m-0 ">Country:</p>
						</div>
						<div class="col-6 my-1 ">
							<p style="color:#747474" class="m-0 text-left">USA</p>
						</div>
						<div class="col-6 my-1  pl-4">
							<p style=" font-weight: 600;" class="m-0">Runtime:</p>
						</div>
						<div class="col-6 my-1 ">
							<p style="color:#747474" class="m-0  text-left">60 min</p>
						</div>
						<div class="col-6 my-1  pl-4">
							<p style=" font-weight: 600;" class="m-0 ">Language:</p>
						</div>
						<div class="col-6 my-1 ">
							<p style="color:#747474" class="m-0 text-left">English</p>
						</div>
						<div class="col-6 my-1  pl-4">
							<p style=" font-weight: 600;" class="m-0">Type:</p>
						</div>
						<div class="col-6 my-1 ">
							<p style="color:#747474" class="m-0 text-left">Short</p>
						</div>
						<div class="col-12 my-4 text-center">
							<a href="#"><button type="button" class="btn px-5 tbtn rounded-pill">WATCH VIDEO</button></a>
						</div>
					</div>
					<!-- 按钮 -->
					</div>
				</div>
				<!-- 右边 -->
				<div class="col-lg-9 col-12 mt-5">
					<h5 style="font-weight: 600;">MOVIE STORY</h5>
					<p style="color: #747474;">Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmod tempor
						incididunt ut labore et dolore magna aliqua.Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris
						nisi ut aliquip ex ea commodo consequat.Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
						dolore eu fugiat nulla pariatur.Excepteur sint occaecat cupidatat non proident,sunt in culpa qui officia deserunt
						mollit anim id est laborum.Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque
						laudantium,totam rem aperiam,eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae</p>
					<p style="color: #747474;">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit,sed quia
						magni dolores eso qui ratione voluptatem sequinesciunt.Neque porro quisquam est,qui dolorem ipsum quia dolor sit
						amet,aonsectetur,adipisci velit,sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam
						aliquam quaerat voluptatem.</p>
					<h5 class="mt-5"style="font-weight: 600;">VIDEO & PHOTO</h5>
					<div style="overflow: hidden;"class=" mt-4"><a href="#">
					<img src="img/single-blog-01.jpg" class="w-100 img1" /></a></div>
					<p style="color: #747474;" class="mt-4">Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut
						fugit,sed quia magni dolores eso qui ratione voluptatem sequinesciunt.Neque porro quisquam est,qui dolorem ipsum
						quia dolor sit amet,aonsectetur,adipisci velit,sed quia non numquam eius modi tempora incidunt ut labore et
						dolore magnam aliquam quaerat voluptatem.</p>
					<div class="row">
						<div class="col-6">
							<h6 style="display: initial;font-weight: 600;">TAGS:</h6>
							<i class="ml-2" ><a href="#"style="color:#e40914;text-decoration: none;">film maker</a>,<a href="#"style="color:#e40914;text-decoration: none;">film studio</a></i>
						</div>
						<div class="col-6 text-right">
							<h6 style="display: initial;font-weight: 600;">SHARE:</h6>
							<a href="#" class="fa fa-facebook mx-2" style="color:#e40914;"></a>
							<a href="#" class="fa fa-twitter mx-2" style="color:#e40914;"></a>
							<a href="#" class="fa fa-pinterest mx-2" style="color:#e40914;"></a>
							<a href="#" class="fa fa-linkedin ml-2" style="color:#e40914;"></a>
						</div>
					</div>
					<!-- 中部网格1 -->
					<div class="mt-5 border px-3">
						<div class="row">
							<!-- 左边 -->
							<div class="col-lg-3 col-12 text-center pb-sm-4 mt-4">
								<img src="img/ava-02.jpg" class="mw-100 px-3" />
								<div class="d-flex flex-wrap justify-content-lg-around justify-content-center mt-4">
									<a href="#" class="fa fa-facebook" style="color:#bfbfbf;text-decoration: none;"></a>
									<a href="#" class="fa fa-twitter mx-md-0 mx-5" style="color:#bfbfbf;text-decoration: none;"></a>
									<a href="#" class="fa fa-google-plus" style="color:#bfbfbf;text-decoration: none;"></a>
								</div>
							</div>
							<!-- 右边 -->
							<div class="col-lg-9 col-12 mt-4 mb-3 pl-sm-0">
								<h5 class=""><a href="#"class="p1">Michael Mikado</a></h5>
								<p style="color: #747474;" class="text-md-left text-center">Front-end dev</p>
								<p style="color: #747474;line-height: 30px;" class="text-md-left text-center pr-sm-3">If you are a newbie to managing a WordPress
									website,then
									tions!You are here at the right track with us be we going to introduce you one of the most basic knowledge
									when owing a WordPress page:how to find your site</p>
							</div>
						</div>
					</div>
					<!-- 中部网格2 -->
					<div class="row mt-4 px-3">
						<div class="col-lg-6 col-12 border">
							<div class="d-flex">
								<a href="#" class="a1 border-0 my-auto">
									<div class="rounded-circle mx-1 rc " style="width:50px;height: 50px; position: relative;">
										<span class="aa1 mx-auto" style="position: absolute;left: 12px;top: -2px; font-size: 30px;color:#bfbfc1 ;">←</span>
									</div>
								</a>
								<div class="mt-4 ml-auto text-right">
									<p style="color: #e40914;">PREVIOUS</p>
									<h5 class=""><a href="#"class="p1">Exploring the New York</a></h5>
									<p style="color: #747474;">Ocyober 15,2018</p>
								</div>
							</div>
						</div>
					
						<div class="col-lg-6 border">
							<div class="d-flex">
								<div class="mt-4 mr-auto text-left">
									<p style="color: #e40914;">NEXT</p>
									<h5 class=""><a href="#"class="p1">Exploring the New York</a></h5>
									<p style="color: #747474;">Ocyober 15,2018</p>
								</div>
								<a href="#" class="a1 border-0 my-auto">
									<div class="rounded-circle mx-1 rc " style="width:50px;height: 50px; position: relative;">
										<span class="aa1 mx-auto" style="position: absolute;left: 12px;top: -2px; font-size: 30px;color:#bfbfc1 ;">→</span>
									</div>
								</a>
							</div>
					
						</div>
					</div>

					<!-- 中部网格3评论区 -->
					<div class="mt-3">
						<h5 style="font-weight: 600;">2COMMENTS</h5>
						<hr />
						<div class="row">
							<!-- 第一个 -->
							<div class="col-lg-2 col-4 mt-3">
								<img src="img/ava-01.jpg" class="mw-100" />
							</div>
							<div class="col-lg-10 col-12 mt-3">
								<h6 class="m-0 pb-2" style="display: inline;"> Edugate
									<a href="#" class="" style="text-decoration: none;float: right;color:#e40914 ;"><span class="ml-2" style="font-size: 14px;">
											<u>Reply</u></span></a>
								</h6>
								<p style="color:#747474;">November 11, 2016 at 9:10 AM</p>
								<p style="color:#747474;">So far, the conversion increase is more due to plain blunt force, but the quality
									of boss conversions and subsequent leads can be increased</p>
							</div>
						</div>
						<div class="row mt-4" style="border-top: 1px solid #747474;">
							<!-- 第二个 -->
							<!-- 左 -->
							<div class="col-lg-2 col-1 mt-4"></div>
							<!-- 右 -->
							<div class="col-lg-10 col-11">
								<div class="row">
									<!-- 图片 -->
									<div class="col-lg-2 col-4 mt-4 p-0">
										<img src="img/ava-01.jpg" class="mw-100 pl-2" />
									</div>
									<!-- 文字 -->
									<div class="col-lg-10 col-12  mt-4">
										<h6 class="m-0 pb-2" style="display: inline;"> Edugate
											<a href="#" class="" style="text-decoration: none;float: right;color:#e40914 ;"><span class="ml-2" style="font-size: 14px;">
													<u>Reply</u></span></a>
										</h6>
										<p style="color:#747474;">November 11, 2016 at 9:10 AM</p>
										<p style="color:#747474;">So far, the conversion increase is more due to plain blunt force, but the quality
											of boss conversions and subsequent leads can be increased</p>
									</div>
								</div>
							</div>
						</div>
					
					</div>
				<!-- 表格 -->
				<div class="mt-5">
					<h5 style="font-weight: 600;">LEAVA ACOMMENT</h5>
					<hr />
					<p style="color:#747474;" class="mt-4">Your email address will not be published.Required fields are marked *</p>
					<form>
						<div class="row">
							<div class="col-lg-6 col-12 mt-3">
								<input type="text" class="form-control"placeholder=" Your Name*" style="height: 50px;" />
							</div>
							<div class="col-lg-6 col-12 mt-3">
								<input type="text" class="form-control"placeholder=" Email*" style="height: 50px;" />
							</div>
							<div class="col-12 mt-3">
								<textarea rows="5" class="w-100" style=""placeholder="Enter your comment"></textarea>
							</div>
							<div class="col-12 mt-3">
								<a href="#"><button type="button" class="btn py-2 px-4 mt-3 tbtn rounded-pill">SUBMIT COMMENT</button></a>
							</div>
						</div>
					</form>
				</div>
				
				<!-- 三张图片 -->
				<div class="mt-5">
					<h4 style="font-weight: 600;">You May Also Like</h4>
					<hr />
					<div class="row">
						<div class="col-lg-4 col-12 mt-2">
							<div style="overflow: hidden;">
							<a href="video.html"> <img src="img/post-01.jpg" class="w-100 img1" style="position: relative;"/></a></div>
							<div style="position: absolute;top:5%;left: 10%;">
								<img src="img/star-01.png" style="margin-left: 5px;"/>
								<p style="color: white;position: absolute;left: 19px;bottom: 43px;">5</p>
								<p style="color: white;font-size: 14px; text-align: center;"class="m-0 pb-2"><b>IMDb</b> </p>
								<a href="#" style="text-decoration: none; display: block; width: 50px;height: 25px;color: white;background-color: red;text-align: center;">Hot</a>
							</div>
							<h6 class="text-center px-sm-3 my-3"style="font-weight: 600;"><a href="#"class="list-a">How To Make a Pimple Disappear With Makeup</a></h6>
						</div>
						
						<div class="col-lg-4 col-12 d-lg-block d-none mt-2">
							<div style="overflow: hidden;">
							<a href="video.html"> <img src="img/post-02.jpg" class="w-100 img1" style="position: relative;"/></a></div>
							<div style="position: absolute;top:5%;left: 10%;">
								<img src="img/star-01.png" style="margin-left: 12px;"/>
								<p style="color: white;position: absolute;left: 25px;bottom: 43px;">5</p>
								<p style="color: white;font-size: 14px; text-align: center;"class="m-0 pb-2"><b>IMDb</b> </p>
								<a href="#" style="text-decoration: none; display: block; width: 65px;height: 25px;color: white;background-color: #ff6c00;text-align: center;">Trend</a>
							</div>
							<h6 class="text-center px-sm-3 my-3"style="font-weight: 600;"><a href="#"class="list-a">How To Make a Pimple Disappear With Makeup</a></h6>
						</div>
						
						<div class="col-lg-4 col-12 d-lg-block d-none mt-2">
							<div style="overflow: hidden;">
							<a href="video.html"> <img src="img/post-03.jpg" class="w-100 img1" style="position: relative;"/></a></div>
							<div style="position: absolute;top:5%;left: 10%;">
								<img src="img/star-01.png" style="margin-left: 5px;"/>
								<p style="color: white;position: absolute;left: 18px;bottom: 43px;">5</p>
								<p style="color: white;font-size: 14px; text-align: center;"class="m-0 pb-2"><b>IMDb</b> </p>
								<a href="#" style="text-decoration: none; display: block; width: 50px;height: 25px;color: white;background-color: red;text-align: center;font-size: 14px;margin-left: 2px;">NEW</a>
							</div>
							<h6 class="text-center px-sm-3 my-3"style="font-weight: 600;"><a href="#"class="list-a">How To Make a Pimple Disappear With Makeup</a></h6>
						</div>
						
					</div>
				</div>
			</div>
		</div>
		</div>
		<!-- 底部 -->
		<div style="width: 100%;background-color: #1c1c1b;margin-top: 70px;" class="mt-5">
			<div class="container">
				<div class="row">
					<!-- 1 -->
					<div class="col-lg-5 col-12 text-center">
						<img src="img/logo-header-05.png" class="mt-5" />
						<p style="color: #747474;" class="mt-4">Loomodo ligula eget dolor.Aenean massa.Cum sociis <br /> que penatibus et
							magnis
							dis parturient montes lorem,<br />nascetur ridiculusmus.Donec quam felis,ultricies nec<br /> massa.Cum sociis...</p>
						<div class="btn-group my-3">
							<input type="text" placeholder="  Email" style="background-color: #1c1c1b;color: #747474; border:1px solid#747474 ;" /><button
							 class="btn "style="background-color: #e40914;color: white;">SUBSCRIBE</button>
						</div>
		
						<div class="d-flex flex-wrap mt-4 justify-content-center">
							<a href="#" class="a1">
								<div class="rounded-circle mx-1 rcc" style="width:40px;height: 40px; position: relative;">
									<i class="fa fa-facebook fa-1x aa1 mx-auto" style="position: absolute;left: 14px;top: 11px;"></i>
								</div>
							</a>
							<a href="#" class="a1 border-0">
								<div class="rounded-circle mx-1 rcc" style="width:40px;height: 40px; position: relative;">
									<i class="fa fa-twitter fa-1x aa1 mx-auto" style="position: absolute;left: 12px;top: 11px;"></i>
								</div>
							</a>
							<a href="#" class="a1 border-0">
								<div class="rounded-circle mx-1 rcc" style="width:40px;height: 40px; position: relative;">
									<i class="fa fa-vimeo fa-1x aa1 mx-auto" style="position: absolute;left: 11px;top: 11px;"></i>
								</div>
							</a>
							<a href="#" class="a1 border-0">
								<div class="rounded-circle mx-1 rcc" style="width:40px;height: 40px; position: relative;">
									<i class="fa fa-youtube-play fa-1x aa1 mx-auto" style="position: absolute;left: 11px;top: 11px;"></i>
								</div>
							</a>
							<a href="#" class="a1 border-0">
								<div class="rounded-circle mx-1 rcc" style="width:40px;height: 40px; position: relative;">
									<i class="fa fa-google-plus fa-1x aa1 mx-auto" style="position: absolute;left: 11px;top: 11px;"></i>
								</div>
							</a>
							<a href="#" class="a1 border-0">
								<div class="rounded-circle mx-1 rcc" style="width:40px;height: 40px; position: relative;">
									<i class="fa fa-instagram fa-1x aa1 mx-auto" style="position: absolute;left: 12px;top: 11px;"></i>
								</div>
							</a>
						</div>
					</div>
					<!-- 2 -->
					<div class="col-lg-4 col-12">
						<p style="color: white;" class="mt-5"><b> LATEST POSTS</b></p>
		
						<div class="row">
							<div class="col-4 mt-1">
								<div style="overflow: hidden;"><a href="#">
									<img src="img/png-post-01.png" class="img1"></a></div>
							</div>
							<div class="col-8 pl-md-3 pl-0">
								<p style="color: white;" class="m-0 mb-2"><a href="#"class="b-p">5 Skin Care Rituals You Should  Be Doing Before Bed</a></p><span
								 style="color:#747474 ;font-size: 14px;">August
									11,2018</span>
							</div>
								</div>
								
								<div class="row mt-3">
							<div class="col-4 mt-1">
								<div style="overflow: hidden;"><a href="#">
									<img src="img/png-post-02.png" class="img1"></a></div>
							</div>
							<div class="col-8 pl-md-3 pl-0 ">
								<p style="color: white;" class="m-0 mb-2"><a href="#"class="b-p">Fashion Outfit Ideas to Try  From Instagram This Week</a></p><span
								 style="color:#747474 ;font-size: 14px;">August
									11,2018</span>
							</div>
							</div>
							
							<div class="row mt-3">
							<div class="col-4 mt-1">
								<div style="overflow: hidden;"><a href="#">
									<img src="img/png-post-03.png" class="img1"></a></div>
							</div>
							<div class="col-8 pl-md-3 pl-0 ">
								<p style="color: white;" class="m-0 mb-2"><a href="#"class="b-p">7 Soaps to Supercharge Your Daily Skincare Routine</a> </p><span
								 style="color:#747474 ;font-size: 14px;">August
									11,2018</span>
							</div>
						</div>
					</div>
		
					<div class="col-lg-3 col-12 ">
						<p style="color: white;" class="mt-5"><b>POPULAR CATEGORY</b></p>
						<div class="row">
							<div class="col-6">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Fragrances</a></p>
							</div>
							<div class="col-6">
								<p style="color: white;" class="m-0 text-md-center text-right">15</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Hair Care</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">12</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Make Up</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">6</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Outfits</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">9</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Skin Care</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">10</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Style</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">8</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Fashion</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">5</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Lifestyle</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">2</p>
							</div>
							<div class="col-6 my-1">
								<p style="color:#747474 ;" class="m-0"><a href="#"class="b-p2">Wellness</a></p>
							</div>
							<div class="col-6 my-1">
								<p style="color: white;" class="m-0 text-md-center text-right">3</p>
							</div>
						</div>
					</div>
				</div>
			</div>
			<hr />
			<p style="color:#747474; text-align: center;" class="px-3 py-2 m-0">Copyright 2018 Corporate WordPress Theme by
				<span style="color: #c6161c;">ThimPress</span></p>
		</div>
<!-- 返回顶部 -->
		<a href="javascript:void(0)"><img src="img/gotop.jpg" id="top" /></a>
	</body>
</html>
<script type="text/javascript"src="js/index.js"charset="utf-8"></script>
